<template>
  <div class="sm-wpu-workpackageCancellation">
    <TableTitle>
      <slot>
        <p>
          扫码操作
        </p>
      </slot>
    </TableTitle>
    <TopSearch ref="topSm">
      <slot>
        <li>
        <el-button size="mini" type="primary" @click="gzbOut">工作包出库</el-button>
      </li>
      <li>
        <el-button size="mini" type="primary" @click="gzbScan">工作包扫码</el-button>
      </li>
      <li>
        <el-button size="mini" type="primary" @click="gzbBack">工作包回库</el-button>
      </li>
      <li>
        <el-button size="mini" type="success" @click="hcxBoxOutBtn">缓存箱出库</el-button>
      </li>
      <li>
        <el-button size="mini" type="success" @click="hcxScan">缓存箱扫码</el-button>
      </li>
      <li>
        <el-button size="mini" type="success" @click="hcxBoxBackBtn">缓存箱回库</el-button>
      </li>
      <li>
        <el-button size="mini" type="success" @click="saveBtn">工作包取消</el-button>
      </li>
      </slot>
    </TopSearch>
    <TableTitle>
      <slot>
        <p>
          AO分拣任务列表
        </p>
      </slot>
    </TableTitle>
    <TopTable></TopTable>
  </div>
</template>
<script>
import TopSearch from "../../../../components/TopSearch.vue";
import TableTitle from "../../../../components/TableTitle.vue";
import TopTable from "./components/TopTable.vue"
import { workCancellationSave } from "@/utils/api.js"
export default {
  name: "WorkpackageCancellation",
  components: {
    TopSearch,
    TopTable,
    TableTitle
  },
  data(){
    return{
      tiaoMa:'',
      gzbTm:'',
      hcxTm:'',
      hcxBoxBack:'',
      hcxBoxCome:'',
    }
  },
  methods:{
    // 工作包出库
    gzbOut(){
      // 扫码框聚焦
      this.$refs.topSm.openScan()
    },
    // 工作包扫码
    gzbScan(){
      this.gzbTm = this.tiaoMa
    },
    // 工作包回库
    gzbBack(){
      // 扫码框清空 并 聚焦
      this.$refs.topSm.makeTmNull()
      this.$refs.topSm.openScan()
    },
    // 缓存箱出库
    hcxBoxOutBtn(){
      // 扫码框聚焦
      this.$refs.topSm.makeTmNull()
    },
    // 缓存箱扫码
    hcxScan(){
      thsi.hcxTm = this.tiaoMa
    },
    // 缓存箱回库
    hcxBoxBackBtn(){
      bufferBoxWarehousing({
          itemCode:this.hcxBoxBack[0].itemCode
        }).then((res)=>{
          console.log('缓存箱回库',res)
          if(res.data.retCode == 200){
            this.$Alert({
              title: "成功",
              message: '缓存箱回库命令已下发！',
              type: "success",
            });
            // 扫码框清空 并 聚焦
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
          }else {
            this.$Alert({
              title: "失败",
              message: '无法下发缓存箱回库命令！',
              type: "error",
            });
          }
        })
    },
    // 保存按钮
    saveBtn(){
      workCancellationSave({
        workbinCode:this.hcxTm,
        toolCode:this.gzbTm
      }).then((res)=>{
        console.log('保存',res)
        if(res.data.retCode == 200) {
          this.$Alert({
            title: "成功",
            message: '保存成功',
            type: "success",
          });
          this.$refs.topSearch.makeTmNull()
          this.$refs.topSearch.openScan()
        }else {
          this.$Alert({
            title: "失败",
            message: '保存失败',
            type: "error",
          });
        }
      })
    }
  },
  mounted(){
    this.$bus.$on('saoma',(e)=>{
      this.tiaoMa = e
    })
    // 传数据 给 hcx出库 hcx回库
    this.$bus.$on('smWcHcxInfo',(e)=>{
      this.hcxBoxBack = e
      this.hcxBoxCome = e
    })
  }
};
</script>
<style scoped>
.el-button--success {
  background: #29bacd;
  border-color: #29bacd;
}
.el-button--success:hover {
  background: #23abbd;
  border-color: #23abbd;
}
</style>